<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>POST 请求</title>
  </head>
  <body>
    <form
      action="https://www.imooc.com/api/http/search/suggest?words=js"
      method="post"
    >
      <input type="text" name="username" />
      <input type="password" name="password" />
      <input type="submit" value="提交" />
    </form>

    <script>
      // 1.携带数据
      // POST 请求主要通过请求体携带数据，同时也可以通过请求头携带
      // const url = 'https://www.imooc.com/api/http/search/suggest?words=js';
      // const xhr = new XMLHttpRequest();

      // xhr.onreadystatechange = () => {
      //   if (xhr.readyState != 4) return;

      //   if ((xhr.status >= 200 && xhr.status < 300) || xhr.status === 304) {
      //     console.log(xhr.responseText);
      //   }
      // };

      // xhr.open('POST', url, true);

      // 如果想发送数据，直接写在 send() 的参数位置，一般是字符串
      // xhr.send('username=alex&age=18');

      // 不能直接传递对象，需要先将对象转换成字符串的形式
      // xhr.send({
      //   username: 'alex',
      //   age: 18
      // });
      // [object Object]

      // 2.数据编码
      // xhr.send(`username=${encodeURIComponent('张三')}&age=18`);
    </script>
  </body>
</html>
